import { color } from '../basic/ee-theme'

/**
 * @typedef {('top-right' | 'top-left' | 'bottom-right' | 'bottom-left')} position
 */

export const props = {
  /** 通知出现的位置，默认为top-right
   * 
   * 也可以自定义位置，名字必须为 '-' 分割的单词，'-' 后面的单词代表了 'move' 出现动画的方向
   * 
   * 容器的 id 为 ee-notify-[position] ，创建 '#' 样式设定容器的位置即可
   * @type {position}
   * 
   * @example
   * // 例子：通知可以在屏幕中间偏上的位置从上往下出现
   * 
   * <ee-notify position="auto-top" text="自定义通知" />
   * 
   * #ee-notify-auto-top {
   *   top: 10vh;
   *   left: 50%;
   *   transform: translate(-50%);
   * }
   */
  position: {
    type: String,
    default: 'top-right'
  },
  /** 不使用 Teleport 保持原位 */
  stay: Boolean,
  /** 要使用的颜色主题，主题可以使用@/basic/ee-color的color方法来创建
   * @type {color}
   */
  color: String,
  /** 文字内容是否也使用主题色彩 */
  colorful: Boolean,
}